<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <title>低代码框架</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/uuid/8.3.2/uuid.min.js"></script>
    <script src="./js/thirdparty/qs.min.js"></script>

    <link href="https://cdn.bootcdn.net/ajax/libs/nprogress/0.2.0/nprogress.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/nprogress/0.2.0/nprogress.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/i18next/22.4.15/i18next.js"></script>
    <script src="./js/language.js"></script>

    <link href="https://cdn.bootcdn.net/ajax/libs/element-plus/2.3.3/index.css" rel="stylesheet">

    <link rel="stylesheet" href="./css/root.css" />
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/main.css" />
    <link rel="stylesheet" href="./css/iconfont/iconfont.css" />
    <link rel="stylesheet" href="./css/layout.css" />
    <link rel="stylesheet" href="http://at.alicdn.com/t/c/font_4583262_oqlvq4m1nfa.css" />
    

    <script src="./js/pinyin.js"></script>
    <script src="./js/fetch.js"></script>

    <!-- react -->
    <!-- <script src="https://cdn.bootcdn.net/ajax/libs/react/17.0.1/umd/react.development.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/react-dom/17.0.1/umd/react-dom.development.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/babel-standalone/7.0.0-beta.3/babel.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
    <script src="https://unpkg.com/antd@4.8.0/dist/antd.min.js"></script>
    <script src="https://unpkg.com/ql_render@1.0.4/dist/ql_render.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/babel-preset-env-standalone@1.6.2/babel-preset-env.min.js"></script> -->
        <!-- <link rel="stylesheet" type="text/css" href="https://unpkg.com/antd@4.8.0/dist/antd.min.css"> -->

    
    <script src="./js/vue.js"></script>
    <script src="https://unpkg.com/vue-router@next"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/element-plus/2.3.3/index.full.js"></script>
    <link rel="stylesheet" href="./css/element.css" />

    <!-- <script src="https://unpkg.com/element-plus"></script> -->

    <script src="./js/el-icon.js"></script>
    <script src="./js/components/menuItem.js"></script>

    <!-- 路由 -->
    <script src="./js/views/table.js"></script>
    <script src="./js/views/tree.js"></script>
    <script src="./js/views/domain.js"></script>
    <script src="./js/views/index.js"></script>

    <script src="./js/utils.js"></script>
    <script src="./js/app.js"></script>
    <script src="./js/main.js"></script>

    <script src="./js/components/hooks.js"></script>
    <script src="./js/templates/basic.js"></script>

    <!-- <link rel="stylesheet" href="./css/animate.css"/> -->
    <!-- <link rel="stylesheet" href="./css/animate.min.css" /> -->


</head>

<body data-theme="default">
    <div id="app">
        <div class="layout">
            <!-- 顶部的一级导航栏 -->
            <div class="top-main-nav" v-if="showTopNavBar">
                <div class="left">
                    <img alt="" src="./img/logo_white.png" class="logo">
                    <!-- <div class="title lang-title">Fantastic-admin 专业版</div> -->
        
                    <!-- <div class="item-list">
                        <el-popover ref="popover" placement="bottom" :width="200" trigger="hover"
                            v-if="showTopNavBar && !showLeftMenu"
                            v-for="(item, index) in mainMenuList">
                            <template #reference>
                                <div class="item" :class="{ active: activeIndex == item.index }"
                                    @click="changeMainMenu(item, index)">
                                    <el-icon :size="22">
                                        <component :is="item.icon"></component>
                                    </el-icon>
                                    <div>{{ item.title }}</div>
                                </div>
                            </template>

                            <el-scrollbar class="scrollbar" wrap-class="scrollbar-wrapper">
                                <el-menu ref="refMenu" :collapse="collapse" style="width: 100%; overflow: hidden;"
                                    class="menu el-menu-vertical" :collapse-transition="true" @select="(subindex, path, item) => handleMenuSelect(subindex, path, item, index)">
                                    <menu-item-component v-for="subitem in menuList" :key="subitem.index" :item="subitem" :parentIndex="item">
                                    </menu-item-component>
                                </el-menu>
                            </el-scrollbar>
                        </el-popover>

                        <div v-else class="item" :class="{ active: activeIndex == item.index }"
                            v-for="(item, index) in mainMenuList" @click="changeMainMenu(item, index)">
                            <el-icon :size="22">
                                <component :is="item.icon"></component>
                            </el-icon>
                            <div>{{ item.title }}</div>
                        </div>
                    </div> -->
                </div>
                <div class="right">
                    <!-- info -->
                    <div class="info">
                        <span class="bell item">
                            <el-badge is-dot class="item">
                                <el-icon>
                                    <bell />
                                </el-icon>
                            </el-badge>
                        </span>

                        <span class="fullscreen item" @click="toggleFullScreen">
                            <i v-if="fullscreen" class="iconfont icon-fullscreen-shrink"></i>
                            <i v-else class="iconfont icon-fullscreen-expand"></i>
                        </span>

                        <el-icon class="item" @click="(e) => refreshCurrent(e)">
                            <refresh />
                        </el-icon>

                        <el-dropdown @command="changeLan" class="name item">
                            <el-icon>
                                <i class="iconfont icon-language-outline"></i>
                            </el-icon>
                            <template #dropdown>
                                <el-dropdown-menu>
                                    <el-dropdown-item command="zh_CN">中文</el-dropdown-item>
                                    <el-dropdown-item command="en">English</el-dropdown-item>
                                </el-dropdown-menu>
                            </template>
                        </el-dropdown>
                        <el-dropdown :hide-on-click="false" class="name" @command="dropdownChangePersonalInfo">
                            <span>
                                <el-avatar :size="23" style="margin-right: 5px; margin-left: 20px;">{{ pinyinFL }}
                                </el-avatar>{{ userName }}
                            </span>
                            <template #dropdown>
                                <el-dropdown-menu>
                                    <el-dropdown-item command="logout">退出登录</el-dropdown-item>
                                </el-dropdown-menu>
                            </template>
                        </el-dropdown>
                    </div>
                </div>
            </div>

            <div class="body" style="display: flex; flex-direction: row; flex: 1; overflow: hidden;">
                <!-- 左侧一级导航 -->
                <div class="left-main" v-if="showLeftNavBar">
                    <img alt="" src="./img/logo1.png" class="logo">
                    <div class="item-list">
                        <el-popover ref="popover" placement="right" :width="200" trigger="hover"
                            v-if="!showLeftMenu"
                            v-for="(item, index) in mainMenuList">
                            <template #reference>
                                <div class="item" :class="{ active: activeIndex == item.index }"
                                    @click="changeMainMenu(item, index)">
                                    <el-icon :size="22">
                                        <component :is="item.icon"></component>
                                    </el-icon>
                                    <div>{{ item.title }}</div>
                                </div>
                            </template>

                            <el-scrollbar class="scrollbar" wrap-class="scrollbar-wrapper">
                                <el-menu ref="refMenu" :collapse="collapse" style="width: 100%; overflow: hidden;"
                                    class="menu el-menu-vertical" :collapse-transition="true" @select="(subindex, path, item) => handleMenuSelect(subindex, path, item, index)">
                                    <menu-item-component v-for="subitem in menuList" :key="subitem.index" :item="subitem">
                                    </menu-item-component>
                                </el-menu>
                            </el-scrollbar>
                        </el-popover>

                        <div v-else class="item" :class="{ active: activeIndex == item.index }"
                            v-for="(item, index) in mainMenuList" @click="changeMainMenu(item, index)">
                            <el-icon :size="22">
                                <component :is="item.icon"></component>
                            </el-icon>
                            <div>{{ item.title }}</div>
                        </div>
                    </div>
                </div>

                <!-- 左侧二级导航栏：logo图片 + 菜单导航 -->
                <div :class="collapse ? 'left' : 'left-fold'" class="left-second" v-if="showLeftMenu">
                    <div v-if="!collapse && showSubTitle " class="web-name lang-title">Fantastic-admin 专业版</div>

                    <div v-if="showSubTitleWithLogo" class="sub-title-withlogo">
                        <img alt="" src="./img/logo1.png"
                            class="logo">
                        <div v-if="!collapse">
                            <el-tooltip class="box-item" effect="dark" content="Fantastic-admin 专业版" placement="right">
                                <div class="web-name lang-title">Fantastic-admin 专业版</div>
                            </el-tooltip>
                        </div>
                    </div>

                    <el-scrollbar class="scrollbar" wrap-class="scrollbar-wrapper">
                        <el-menu ref="refMenu" :default-active="activeIndex" :collapse="collapse"
                            class="menu el-menu-vertical" :collapse-transition="true" @select="handleMenuSelect">
                            <menu-item-component v-for="item in menuList" :key="item.index" :item="item"
                                class="">
                            </menu-item-component>
                        </el-menu>
                    </el-scrollbar>
                </div>

                <!-- 内容区域 -->
                <div class="right-content">
                    <div class="tags-box" v-if="showTopTab">
                        <div class="tags" style="flex: 1;">
                            <div class="tag-box" v-for="cachedView in cachedViews" :key="cachedView.index">
                                <el-tag class="tag" :closable="cachedViews && cachedViews.length > 1"
                                    :type="isActive(cachedView) ? '' : 'info'" @click="clickTag(cachedView)"
                                    @close="closeSingleTag(cachedView)" effect="dark">
                                    <el-icon :size="22">
                                        <component :is="cachedView.icon"></component>
                                    </el-icon>{{ cachedView.title }}
                                </el-tag>
                                <div class="left-root"></div>
                                <div class="right-root"></div>
                            </div>
                        </div>
                        <!-- <el-scrollbar class="tags-scrollbar tags">
                            <div class="tag-box" v-for="cachedView in cachedViews" :key="cachedView.index">
                                <el-tag class="tag" :closable="cachedViews && cachedViews.length > 1"
                                    :type="isActive(cachedView) ? '' : 'info'" @click="clickTag(cachedView)"
                                    @close="closeSingleTag(cachedView)" effect="dark">
                                    <el-icon :size="22">
                                        <component :is="cachedView.icon"></component>
                                    </el-icon>{{ cachedView.title }}
                                </el-tag>
                                <div class="left-root"></div>
                                <div class="right-root"></div>
                            </div>

                        </el-scrollbar> -->
                        <div class="more-action" v-if="cachedViews && cachedViews.length > 1">
                            <el-dropdown popper-class="tag-action-popper" :hide-on-click="false">
                                <span class="el-dropdown-link">
                                    <li class="el-icon-dropdown" style="list-style: none;
                                        height: 20px;
                                        width: 20px;
                                        background-color: rgba(255,255,255, 0.5);
                                        border-radius: 4px;
                                        display: flex;
                                        align-items: center;
                                        justify-content: center;
                                        padding: 2px;">
                                        <el-icon :size="22">
                                            <component is="CaretBottom"></component>
                                        </el-icon>
                                    </li>
                                </span>
                                <template #dropdown>
                                    <div class="actions">
                                        <el-button type="primary" icon="Close" circle
                                            :disabled="cachedViews.length === 1" @click="closeOtherTag"> </el-button>
                                        <el-button type="primary" icon="Back" circle :disabled="disabledLeft"
                                            @click="closeLeftTag"> </el-button>
                                        <el-button type="primary" icon="Right" circle :disabled="disabledRight"
                                            @click="closeRightTag"> </el-button>
                                    </div>
                                    <el-dropdown-menu>
                                        <el-dropdown-item v-for="cachedView in cachedViews" :key="cachedView.index">
                                            <el-tag class="tag" :closable="cachedViews && cachedViews.length > 1"
                                                :type="isActive(cachedView) ? '' : 'info'" @click="clickTag(cachedView)"
                                                @close="closeSingleTag(cachedView)" effect="dark">
                                                <el-icon :size="22">
                                                    <component :is="cachedView.icon"></component>
                                                </el-icon>{{ cachedView.title }}
                                            </el-tag>
                                        </el-dropdown-item>
                                    </el-dropdown-menu>
                                </template>
                            </el-dropdown>
                        </div>

                    </div>

                    <div class="navbar">
                        <div class="left">
                            <span class="icon" @click="toggleCollapse">
                                <el-icon v-if="collapse">
                                    <d-arrow-right />
                                </el-icon>
                                <el-icon v-else>
                                    <d-arrow-left />
                                </el-icon>
                            </span>

                            <el-dropdown :hide-on-click="false" popper-class="star-action-popper">
                                <el-icon>
                                    <star />
                                </el-icon>
                                <template #dropdown>
                                    <div class="top">
                                        <span class="text">我的收藏夹</span>
                                        <span class="icon" v-if="!isAtHome">
                                            <el-icon @click="addStar" :size="20" v-if="showEmptyStar">
                                                <star />
                                            </el-icon>
                                            <el-icon :size="23" v-else>
                                                <star-filled />
                                            </el-icon>
                                        </span>
                                    </div>
                                    <div class="empty-box" v-if="starList.length === 0">
                                        <el-empty description=" " />
                                        <span>收藏夹是空的</span> <br />
                                        <span>
                                            请点击右上角的 <el-icon>
                                                <star />
                                            </el-icon>将当前页面添加到收藏夹
                                        </span>
                                    </div>

                                    <div class="star-list" v-else>
                                        <el-row style="width: 100%;">
                                            <el-col :span="12" v-for="star in starList" style="padding: 0px 5px;">
                                                <el-tag closable class="tag" style="width: 100%;"
                                                    @close="() => removeStar(star)">
                                                    <el-icon :size="22">
                                                        <component :is="star.icon"></component>
                                                    </el-icon>{{ star.title }}
                                                </el-tag>
                                            </el-col>
                                        </el-row>

                                    </div>
                                </template>
                            </el-dropdown>

                            <el-breadcrumb>
                                <el-breadcrumb-item v-for="(item, index) in currentViewPathList" :key="item.index">
                                    {{ item.title ?? '[ 无标题 ]' }}
                                </el-breadcrumb-item>
                            </el-breadcrumb>
                        </div>

                        <!-- info -->
                        <div class="info" v-if="!showTopNavBar">
                            <span class="bell item">
                                <el-badge :value="9" class="item">
                                    <el-icon>
                                        <bell />
                                    </el-icon>
                                </el-badge>
                            </span>

                            <span class="fullscreen item" @click="toggleFullScreen">
                                <i v-if="fullscreen" class="iconfont icon-fullscreen-shrink"></i>
                                <i v-else class="iconfont icon-fullscreen-expand"></i>
                            </span>

                            <el-icon class="item" @click="(e) => refreshCurrent(e)">
                                <refresh />
                            </el-icon>

                            <el-dropdown class="item" @command="changeLan">
                                <el-icon>
                                    <i class="iconfont icon-language-outline"></i>
                                </el-icon>
                                <template #dropdown>
                                    <el-dropdown-menu>
                                        <el-dropdown-item command="zh_CN">中文</el-dropdown-item>
                                        <el-dropdown-item command="en">English</el-dropdown-item>
                                    </el-dropdown-menu>
                                </template>
                            </el-dropdown>
                            <el-dropdown :hide-on-click="false" class="name" @command="dropdownChangePersonalInfo">
                                <span>
                                    <el-avatar :size="23" style="margin-right: 5px; margin-left: 20px;">{{ pinyinFL }}
                                    </el-avatar>{{ userName }}
                                </span>
                                <template #dropdown>
                                    <el-dropdown-menu>
                                        <el-dropdown-item command="logout">退出登录</el-dropdown-item>
                                    </el-dropdown-menu>
                                </template>
                            </el-dropdown>
                        </div>
                    </div>

                    <div class="app-main" id="app-main">
                        
                    </div>
                </div>
            </div>
        </div>

        <!-- #region 应用设置 -->
        <!-- <el-drawer v-model="drawer" title="应用设置">
            <el-radio-group v-model="templateIndex">
                <el-radio label="0">模板1</el-radio>
                <el-radio label="1">模板2</el-radio>
                <el-radio label="2">模板3</el-radio>
                <el-radio label="3">模板4</el-radio>
                <el-radio label="4">模板5</el-radio>
            </el-radio-group>

            <div>
                是否展示顶部Tab： <el-switch v-model="showTopTab" class="ml-2" />
            </div>
        </el-drawer>

        <div class="setting-icon" @click="drawer = true;">
            <span>
                <el-icon class="rotate">
                    <Setting />
                </el-icon>
            </span>
        </div> -->
        <!-- #endregion 应用设置 -->


    </div>

    <script>
        var app = bootstrap();
        initLanguage();
    </script>

    <script>
        // token=&dbcl=&syspass=qazwsx123&sysuser=888888&inppass=&syspassold=&syspassnew=&syspassnew1=&dqhsp_code=&dqhsp_name=&dqdepartment_code=&dqdepartment_name=&dqsysusername=&DQBH=&DQBHindex=&Appenginename=&mainpag=first&vbs=20240615212404
        // fetchData('https://cloud.lugangwool.com/server/loginfo.php?dbcl=', "syspass=qazwsx123&sysuser=888888", {})
        // fetchData('https://cloud.lugangwool.com/server/loginfo.php?dbcl=', 
        // {
        //     syspass: 'qazwsx123',
        //     sysuser: '888888'
        // }, {})
    </script>
</body>

</html>